<template>
  <j-modal :title="componentItem['title']" :width="width" :visible="visible" switchFullscreen @ok="handleOk"
    :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }" @cancel="handleCancel" cancelText="关闭">
    <component ref="realForm" v-if="key" @ok="submitCallback" :is="allComps[componentItem['componentsName']]"
      :componentKey="key" :disabled="disableSubmit" />
  </j-modal>
</template>

<script>
import allComps, { components } from './formModal'
export default {
  name: "handleModal",
  data() {
    return {
      width: 800,
      visible: false,
      disableSubmit: false,
      key: null,
      allComps: allComps,
      components: components
    }
  },
  computed: {
    componentItem() {
      let key = 'key'
      let data = { title: '', componentsName: '' }
      let item = this.components.find(obj => { return obj[key] === this.key }) || {}
      if (item && Object.keys(item).length > 0) {
        data['title'] = item['title']
        data['componentsName'] = item['componentsName']
      }
      return data
    }
  },
  // watch: {
  //   visible: {
  //     immediate: true,
  //     deep: true,
  //     handler(val) {
  //       // if(val) this.result = {}
  //     }
  //   }
  // },
  methods: {
    add(key) {
      this.key = key
      this.visible = true
      this.$nextTick(() => {
        if (this.$refs.realForm) this.$refs.realForm.show();
      })
    },
    edit(key, record) {
      this.key = key
      this.visible = true
      this.$nextTick(() => {
        if (this.$refs.realForm) this.$refs.realForm.show(record);
      })
    },
    show(key, record, paramValue) {
      this.key = key
      this.visible = true
      this.$nextTick(() => {
        if (this.$refs.realForm) this.$refs.realForm.show(record, paramValue);
      })
    },
    close() {
      this.$emit('close');
      this.visible = false;
    },
    handleOk() {
      if (this.$refs.realForm) this.$refs.realForm.submitForm();
    },
    handleCancel() {
      this.close()
    },
    submitCallback() {
      this.$emit('ok', this.key);
      this.visible = false;
    }
  }
}
</script>
<style scoped lang="less">

</style>